<template>
	<view class="page">
		<view class="page-bg"></view>
		<uni-nav-bar ref="navBar" fixed statusBar :border="false" backgroundColor="transparent" left-width="200px">
			<template v-slot:left>
				<view class="flex">
					<image src="@/static/image/login-logo.png" class="size-32 mr-4" style="border-radius: 50%;">
					</image>
					<view class="flex item-center">
						<text class="uni-primary text-bold" style="margin-right: 4px;">火动通告 </text> |
						<text style="font-size:8px;margin-left: 4px;">商户端</text>
					</view>
				</view>
			</template>
		</uni-nav-bar>
		<!-- 待审核 -->
		<successPage   v-if="getstatus(1)"  :settleData="data"></successPage>
		<view class="content"    v-if="data.auditState == 4">
			<view class="icon-success flex item-center justify-center">
				<uni-icons type="checkmarkempty" size="80" color="#ffffff"></uni-icons>
			</view>
			<view class="load-text">待认证</view>
			<view class="load-msg">您的入驻申请已通过，已向法人手机号{{getPhone(data.legalMobileNo)}}发送认证短信，请注意查收并于3日内完成认证。</view>
			<view class="no-load-tip">
				未收到短信/短信失效？
			</view>
			<view class="res-load-box">
				<view>开通营销补贴分账功能需签署《营销补贴补充协议》请下载协议，加盖公章后，寄送至下述地址:</view>
				<view class="load-file">下载《营销补贴补充协议》</view>
				<view class="res-adress">
					收件人:张任琪
				</view>
				<view class="res-adress">
					联系电话:021-33323999
				</view>
				<view class="res-adress">
					收件地址:上海市徐汇区宜山路700号普天产业科技园C5栋汇付天下总部大楼
				</view>
			</view>
		</view>	
		<!-- 审核不通过 -->
		<view class="content"  v-if="getstatus(2)">
			<!-- <view class="content"  v-if="data.auditState == 3"> -->
			<view class="icon-fail flex item-center justify-center">
				<uni-icons type="closeempty" size="80" color="#ffffff"></uni-icons>
			</view>
			<view class="load-text">审核不通过</view>
			<view class="load-tip">原因：{{data.refuseReason}}</view>
			<view class="release-btn" @click="nextStep">修改入驻资料</view>
		</view>
	</view>
</template>

<script setup>
	import uniIcons from '@/applyPages/uni_modules/uni-icons/components/uni-icons/uni-icons.vue';
	import {getEnterInfo} from '@/api/businessEnterApply.js'
	import successPage from '../components/successPage.vue'
	import {ref,onMounted} from 'vue';
	import {onLoad} from '@dcloudio/uni-app'
	// import { myPageApi } from '@/api/index.js'
	const data = ref({})
	const stateType = ref(null)
	const getInfo = async () => {
		let result = await getEnterInfo({openid:uni.getStorageSync('openId')})
		if(result){
			data.value = result
		}
	}
	const getPhone = (phone) => {
		return phone.replace(phone.substring(3,7), "****")
	}
	const nextStep = () => {
		let url = data.value.settlementType == 2?`/applyPages/businessPage/businessPage?result=rebuild`:`/applyPages/bussinessApply/bussinessApply?result=rebuild`
		
		uni.navigateTo({
			url:url
		})
	}
	const getstatus = (num) => {
		if(num ==1){
			if(stateType.value){
				return stateType.value ==1
			}else{
				return data.value.auditState == 1
			}
		}else if(num == 2){
			if(stateType.value){
				return stateType.value ==2
			}else{
				return data.value.auditState == 3
			}
		}
	}
	onMounted(() => {
		getInfo()
	})
	onLoad(({state}) => {
		stateType.value = state
	})
</script>

<style scoped lang="scss">
.page {
	position: relative;
	width: 100vw;
	height: 100%;
}
.content{
	position: relative;
	z-index: 1;
}
.page-bg {
	z-index: 0;
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	background-image: radial-gradient(circle at left top, #D8230A26 50%, transparent 50%);
	background-size: 396px 396px;
	background-repeat: no-repeat;
	filter: blur(50px);
}

.icon-success ,.icon-fail{
	width: 100px;
	height: 100px;
	background: rgba(252, 181, 19, 1);
	border-radius: 50%;
	margin: 20px auto;
}
.icon-fail{
	background-color: rgba(250, 69, 67, 1);
}
.load-text{
	font-size: 16px;
	font-weight: 600;
	line-height: 22px;
	text-align: center;
}
.load-tip{
	font-size: 12px;
	font-weight: 400;
	line-height: 17px;
	text-align: center;
	color: rgba(51, 51, 51, 0.6);
	margin: 0 20px;
	margin-top: 12px;
	word-break: break-all;
}
.release-btn {
	// width: 343px;
	height: 46px;
	padding: 12px, 20px, 12px, 20px;
	border-radius: 8px;
	// gap: 10px;
	background: #FA4543;
	color: #ffffff;
	margin: 40px  20px 20px;
	text-align: center;
	line-height: 46px;

	&.unactive {
		background: rgba(169, 171, 172, 1);
	}
}
.load-msg{
	margin: 20px;
	padding: 10px;
	background: rgba(245, 245, 245, 1);
	border-radius: 12px;
	font-size: 12px;
	font-weight: 400;
	line-height: 17px;
	text-align: center;
	color: rgba(51, 51, 51, 0.6);
}
.no-load-tip{
	font-size: 12px;
	font-weight: 400;
	line-height: 17px;
	letter-spacing: 0px;
	text-align: center;
	color: rgba(0, 174, 255, 1);

}
.res-load-box{
	margin: 20px;
	padding: 10px;
	background: rgba(245, 245, 245, 1);
	border-radius: 12px;
	font-size: 12px;
	font-weight: 400;
	line-height: 17px;
	color: rgba(51, 51, 51, 1);
	.load-file{
		color: rgba(0, 174, 255, 1);
		padding: 6px 0;
	}
	.res-adress{
		padding: 0 0 4px 0;
	}
}
</style>
